<template>
  <table style="width: 100%;border-collapse: collapse;border-spacing:0;word-break: break-all;">
    <colgroup>
      <col width="60" />
      <col width="90" />
      <col width="190" />
      <col width="100" />
      <col width="100" />
    </colgroup>
    <thead>
      <tr class="materialBomTheadTr" data-index="theadIndex">
        <th style="text-align: center;padding: 2px 3px;border: 1px solid #888;border-top:none;border-left:none;" colspan="5">
          物料信息：序号/物料品号/名称(规格、代号)/数量/备注
        </th>
      </tr>
    </thead>
    <tbody>
      <tr  class="materialBomTbodyTr"
        :data-index="index"
        v-for="(item, index) in tableData"
        :key="index"
      >
        <td style="padding: 2px 3px;border: 1px solid #888;border-left:none;">{{ index + 1 }}</td>
        <td style="padding: 2px 3px;border: 1px solid #888;border-left:none;">{{ item.mcode }}</td>
        <td style="padding: 2px 3px;border: 1px solid #888;border-left:none;">{{ item.mname }}</td>
        <td style="padding: 2px 3px;border: 1px solid #888;border-left:none;">{{ item.stationsRequired }}</td>
        <td style="padding: 2px 3px;border: 1px solid #888;border-left:none;">{{ item.mexplain }}</td>
      </tr>
    </tbody>
  </table>
</template>

<script>
export default {
  props: {
    tableData: {
      type: Array,
      default: () => []
    }
  },
}
</script>
